/**
 * 
 */
/*
 * ===================================================
 * 说明：这是一个用JAVASCRPT类实现的显示树型结构的类。程序的0.5版（第一次编写的不完美程序）是用JAVASCRIPT和XML
 * DOM实现的，在IE5.5以下的版本中，必须安装MSXML3.0组件才可以使用。 该版本的程序采用数组代替了XML DOM，速度更快，也更稳定！
 * 下一步，我将使用HTML DOM 编写ListView类，请喜欢的朋友为我提供思路
 * 这是我第一个写成的自己比较满意的作品，欢迎大家多提意见。在此，将源代码全部公开，喜欢能为大家所使用
 * 
 * 类中的方法为： add(节点编号，父节点编号，节点文字) refresh() 根据数组中的内容更改外观
 * 
 * 类中的属性为： container 一个TD的HTML DOM节点，需要更改TREEVIEW的外观时使用 selectedID 当前选中的节点的编号
 * data 存贮节点信息的数组
 * 
 * 使用方法： 一般与服务器端的目录结构表一起使用 eg: var tv=new TreeView("tv");
 * 这里要注意，由于类中成员对象的事件中，不能识别对象本身，所以必须在类的构造函数中加入代表对象名的字符串 tv.add(0,1,"跟目录一");
 * 0代表在跟节点下添加节点 tv.add(1,2,"子目录一"); tv.refresh(); 显示外观
 * 
 * 注：程序中使用了六张图片，注意指定它们的路径，需要的话可以在http://www.fangfa.net/treeview/下下载
 * ===================================================
 */

// 预先下载图片
var ImagePath = "./"; // 在这里定义默认的图片路径

var img1 = new Image();
img1.src = ImagePath + "close.gif";
var img2 = new Image();
img2.src = ImagePath + "closeitem.gif";
var img3 = new Image();
img3.src = ImagePath + "closeselect.gif";
var img4 = new Image();
img4.src = ImagePath + "open.gif";
var img5 = new Image();
img5.src = ImagePath + "openitem.gif";
var img6 = new Image();
img6.src = ImagePath + "openselect.gif";
// **********************************************************
// * TreeView类 *
// * 功能：显示树型结构 *
// * 时间：2002-9-27 17：25 *
// * 作者：阿福，happy_afu@sina.com *
// * 版本：1.0 *
// **********************************************************
// 注：数组格式：Array(编号，父节点编号，文本，级数，选择情况，展开情况，子节点ID列表)
function TreeView(ObjectVarName) {
	// 属性
	this.OverTag = null; // 鼠标移上时候的标签
	this.OverObj = null; // 鼠标移上时候的对象
	this.container = CreateTable(); // 创建最初的表格，返回容器对象
	this.selectedID = null; // 得到当前选中的对象
	this.data = new Array();
	// 方法
	this.CreateRow = CreateRow; // 创建行
	// 高层函数
	this.add = add; // 添加节点
	this.refresh = refresh; // 根据XML节点的值来创建TREEVIEW外观
	this.ADDNODE = ADDNODE; // 递归方法加入节点

	this.add = add;
	function add(ParentID, ID, TEXT) {
		// 首先检查数组中是否已经存在这个元素
		var item;
		for (item in this.data) {
			if (this.data[item][0] == ID) {
				alert("ID为" + ID + "的元素已经存在!");
				return;
			}
		}

		if (ParentID == 0) {
			this.data[ID] = new Array(ID, ParentID, TEXT, 1, false, false,
					new Array());
		} else {
			// 首先找到父节点
			for (item in this.data) {
				if (this.data[item][0] == ParentID) {
					// 在父节点的ID列表中加入
					this.data[item][6][this.data[item][6].length] = ID;
					var level = this.data[item][3] + 1;
					this.data[ID] = new Array(ID, ParentID, TEXT, level, false,
							false, new Array());
					return;
				}
			}
			// 如果没有找到
			alert("没有找到ParentID为" + ParentID + "的父节点");
			return;
		}
	}

	// *创建最初的表格，返回容器对象
	function CreateTable() {
		var TableID = "maintable";
		var TableText;
		var classText = "background-color:#FFFFFF;"; // 这里是控制风格的代码
		TableText = "<table border=0 cellpadding=0 cellspacing=0 style='"
				+ classText + "'" + " id='" + TableID + "'"
				+ "><tbody><tr><td></td></tr></tbody></table>";
		document.write(TableText);
		return document.all[TableID].childNodes[0].childNodes[0].childNodes[0]; // 返回最里面单元格的对象
	}

	// *创建一表格，作为外观的行
	function CreateRow(ID, text, level, IsClose, hasChild, Selected, locate) // 插入一行,在表格中第LOCATE行插入
	{
		// 创建table标记
		var table = document.createElement("TABLE");
		table.setAttribute("id", "t" + ID);
		table.setAttribute("border", "0");
		table.setAttribute("cellpadding", "0");
		table.setAttribute("cellspacing", "0");
		table.setAttribute("height", "16");
		table.setAttribute("cellpadding", "0");
		// 创建tbaby标记
		var tbody = document.createElement("TBODY");
		// 创建tr标记
		var tr = document.createElement("TR");
		// 创建缩进单元格
		var indent = document.createElement("TD");
		indent.setAttribute("width", (level - 1) * 16 + 1);
		tr.appendChild(indent);
		// 创建图片单元格
		var imgtd = document.createElement("TD");
		imgtd.setAttribute("width", "32");
		// 定义节点图片
		var ImagePath = "./"; // 定义图片路径
		var ImgFC = ImagePath + "close.gif" // 关闭的父节点
		var ImgFO = ImagePath + "open.gif" // 打开的父节点
		var ImgFCS = ImagePath + "closeselect.gif" // 关闭选中的父节点
		var ImgFOS = ImagePath + "openselect.gif" // '打开选中的父节点
		var ImgCOS = ImagePath + "openitem.gif" // 打开选中的子节点
		var ImgCC = ImagePath + "closeitem.gif" // 关闭的子节点
		var img;
		if (hasChild) // 如果有子节点
		{
			if (IsClose) // 如果是关闭的父节点
			{
				if (Selected) {
					img = ImgFCS;
				}// 如果是关闭未选中的父节点
				else {
					img = ImgFC;
				}// 如果是关闭选中的父节点
			} else // 如果是打开的父节点
			{
				if (Selected) {
					img = ImgFOS;
				}// 如果是打开未选中的父节点
				else {
					img = ImgFO;
				}// 如果是打开选中的父节点
			}
		} else // 如果没有子节点
		{
			if (Selected) {
				img = ImgCOS;
			}// 如果是选中的子节点
			else {
				img = ImgCC;
			}// 如果是未选中的子节点
		}
		// 创建图片标记
		var nodeimg = document.createElement("IMG");
		nodeimg.setAttribute("width", "32");
		nodeimg.setAttribute("height", "16");
		nodeimg.setAttribute("id", "i" + ID);
		nodeimg.setAttribute("src", img);
		imgtd.appendChild(nodeimg);
		tr.appendChild(imgtd);
		// 创建文本单元格
		var textnode = document.createElement("TD");
		textnode.setAttribute("id", "d" + ID);
		textnode.setAttribute("title", text);
		if (text.length > 8) {
			text = text.substr(0, 8) + "..";
		}
		textnode.innerText = text;
		tr.appendChild(textnode);
		// 下面进行组合
		tbody.appendChild(tr);
		table.appendChild(tbody);
		// 下面插入主容器
		if (locate < 0 || locate > this.container.childNodes.length - 1) {
			this.container.appendChild(table);
		} else {
			this.container.insertBefore(table,
					this.container.childNodes[locate]);
		}
		// 下面是控制风格的代码
		document.all["i" + ID].style.cursor = "hand";
		document.all["d" + ID].style.cursor = "hand";
		if (Selected == true) {
			document.all["d" + ID].style.backgroundColor = "#003399";
			document.all["d" + ID].style.color = "#FFFFFF";
		}
	}
	var root = {
		"Operating System" : {
			"id" : 81,
			"parentId" : 0,
			"Operating Systemchilds" : {
				"Windows" : {
					"id" : 83,
					"parentId" : 81,
					"name" : "Windows",
					"Windowschilds" : {}
				},
				"FreeBSD" : {
					"id" : 891,
					"parentId" : 81,
					"desc" : "我有个同学在使用FreeBSD.",
					"FreeBSDchilds" : {},
					"name" : "FreeBSD"
				},
				"Mac" : {
					"id" : 890,
					"parentId" : 81,
					"desc" : "Max OS X Lion 使用的还是有的.哈哈",
					"name" : "Mac",
					"Macchilds" : {}
				},
				"Ubuntu" : {
					"id" : 82,
					"parentId" : 81,
					"name" : "Ubuntu",
					"Ubuntuchilds" : {}
				}
			},
			"name" : "Operating System"
		},
		"JS&CSS&HTML" : {
			"id" : 101,
			"parentId" : 0,
			"JS&CSS&HTMLchilds" : {
				"HTML" : {
					"id" : 102,
					"parentId" : 101,
					"name" : "HTML",
					"HTMLchilds" : {}
				},
				"CSS" : {
					"id" : 103,
					"parentId" : 101,
					"name" : "CSS",
					"CSSchilds" : {}
				},
				"JQuery" : {
					"id" : 105,
					"parentId" : 101,
					"JQuerychilds" : {},
					"name" : "JQuery"
				},
				"JS" : {
					"id" : 104,
					"parentId" : 101,
					"name" : "JS",
					"JSchilds" : {}
				}
			},
			"name" : "JS&CSS&HTML"
		},
		"Tools&IDE" : {
			"id" : 61,
			"parentId" : 0,
			"Tools&IDEchilds" : {
				"Eclipse" : {
					"id" : 62,
					"parentId" : 61,
					"name" : "Eclipse",
					"Eclipsechilds" : {}
				},
				"NetBeans" : {
					"id" : 63,
					"parentId" : 61,
					"NetBeanschilds" : {},
					"name" : "NetBeans"
				},
				"maven" : {
					"mavenchilds" : {},
					"id" : 64,
					"parentId" : 61,
					"name" : "maven"
				},
				"svn" : {
					"id" : 65,
					"parentId" : 61,
					"name" : "svn",
					"svnchilds" : {}
				},
				"GIT" : {
					"id" : 892,
					"parentId" : 61,
					"desc" : "Git也是很好的.哈哈.你也来使用吧!",
					"GITchilds" : {},
					"name" : "GIT"
				}
			},
			"name" : "Tools&IDE"
		},
		"Java" : {
			"id" : 22,
			"parentId" : 0,
			"name" : "Java",
			"Javachilds" : {
				"JavaEE" : {
					"id" : 889,
					"parentId" : 22,
					"desc" : "JCP&JPA&JMail",
					"name" : "JavaEE",
					"JavaEEchilds" : {}
				},
				"freemarker" : {
					"freemarkerchilds" : {},
					"id" : 27,
					"parentId" : 22,
					"name" : "freemarker"
				},
				"Hibernate" : {
					"id" : 24,
					"parentId" : 22,
					"name" : "Hibernate",
					"Hibernatechilds" : {}
				},
				"  jsp&servlet " : {
					"id" : 28,
					"parentId" : 22,
					"desc" : "Java+EE+6+API+Specifications.CHM",
					"name" : "  jsp&servlet ",
					"  jsp&servlet childs" : {}
				},
				"JavaEEOne" : {
					"id" : 888,
					"parentId" : 22,
					"desc" : "JCP&JPA",
					"name" : "JavaEEOne",
					"JavaEEOnechilds" : {}
				},
				"JSP&Servlet&MVC2" : {
					"id" : 26,
					"parentId" : 22,
					"desc" : "descrtiption is need for every column",
					"name" : "JSP&Servlet&MVC2",
					"JSP&Servlet&MVC2childs" : {}
				},
				"Spring" : {
					"id" : 23,
					"parentId" : 22,
					"name" : "Spring",
					"Springchilds" : {}
				},
				"junit" : {
					"id" : 29,
					"parentId" : 22,
					"name" : "junit",
					"junitchilds" : {}
				}
			}
		}
	}

}
//查看下一部分

[ {
	"id" : 81,
	"parentId" : 0,
	"name" : "Operating System",
	"children" : [ {
		"id" : 890,
		"parentId" : 81,
		"desc" : "Max OS X Lion 使用的还是有的.哈哈",
		"name" : "Mac",
		"children" : []
	}, {
		"id" : 83,
		"parentId" : 81,
		"name" : "Windows",
		"children" : []
	}, {
		"id" : 891,
		"parentId" : 81,
		"desc" : "我有个同学在使用FreeBSD.",
		"name" : "FreeBSD",
		"children" : []
	}, {
		"id" : 82,
		"parentId" : 81,
		"name" : "Ubuntu",
		"children" : []
	} ]
}, {
	"id" : 61,
	"parentId" : 0,
	"name" : "Tools&IDE",
	"children" : [ {
		"id" : 63,
		"parentId" : 61,
		"name" : "NetBeans",
		"children" : []
	}, {
		"id" : 892,
		"parentId" : 61,
		"desc" : "Git也是很好的.哈哈.你也来使用吧!",
		"name" : "GIT",
		"children" : []
	}, {
		"id" : 64,
		"parentId" : 61,
		"name" : "maven",
		"children" : []
	}, {
		"id" : 65,
		"parentId" : 61,
		"name" : "svn",
		"children" : []
	}, {
		"id" : 62,
		"parentId" : 61,
		"name" : "Eclipse",
		"children" : []
	} ]
}, {
	"id" : 101,
	"parentId" : 0,
	"name" : "JS&CSS&HTML",
	"children" : [ {
		"id" : 105,
		"parentId" : 101,
		"name" : "JQuery",
		"children" : []
	}, {
		"id" : 104,
		"parentId" : 101,
		"name" : "JS",
		"children" : []
	}, {
		"id" : 102,
		"parentId" : 101,
		"name" : "HTML",
		"children" : []
	}, {
		"id" : 103,
		"parentId" : 101,
		"name" : "CSS",
		"children" : []
	} ]
}, {
	"id" : 22,
	"parentId" : 0,
	"name" : "Java",
	"children" : [ {
		"id" : 29,
		"parentId" : 22,
		"name" : "junit",
		"children" : []
	}, {
		"id" : 28,
		"parentId" : 22,
		"desc" : "Java+EE+6+API+Specifications.CHM",
		"name" : "  jsp&servlet ",
		"children" : []
	}, {
		"id" : 26,
		"parentId" : 22,
		"desc" : "descrtiption is need for every column",
		"name" : "JSP&Servlet&MVC2",
		"children" : []
	}, {
		"id" : 24,
		"parentId" : 22,
		"name" : "Hibernate",
		"children" : []
	}, {
		"id" : 889,
		"parentId" : 22,
		"desc" : "JCP&JPA&JMail",
		"name" : "JavaEE",
		"children" : []
	}, {
		"id" : 888,
		"parentId" : 22,
		"desc" : "JCP&JPA",
		"name" : "JavaEEOne",
		"children" : []
	}, {
		"id" : 27,
		"parentId" : 22,
		"name" : "freemarker",
		"children" : []
	}, {
		"id" : 23,
		"parentId" : 22,
		"name" : "Spring",
		"children" : []
	} ]
} ]


//try 3
[{
	"data" : {
		"title" : "Tools&IDE",
		"attr" : {
			"id" : 61
		}
	},
	"children" : [ {
		"data" : {
			"title" : "maven",
			"attr" : {
				"id" : 64
			}
		},
		"children" : [],
		"attr" : {
			"id" : 61
		}
	}, {
		"data" : {
			"title" : "NetBeans",
			"attr" : {
				"id" : 63
			}
		},
		"children" : [],
		"attr" : {
			"id" : 61
		}
	}, {
		"data" : {
			"title" : "Eclipse",
			"attr" : {
				"id" : 62
			}
		},
		"children" : [],
		"attr" : {
			"id" : 61
		}
	}, {
		"data" : {
			"title" : "svn",
			"attr" : {
				"id" : 65
			}
		},
		"children" : [],
		"attr" : {
			"id" : 61
		}
	}, {
		"data" : {
			"title" : "GIT",
			"attr" : {
				"id" : 892,
				"title" : "Git也是很好的.哈哈.你也来使用吧!"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 61
		}
	} ],
	"attr" : {
		"id" : 0
	}
}, {
	"data" : {
		"title" : "Java",
		"attr" : {
			"id" : 22
		}
	},
	"children" : [ {
		"data" : {
			"title" : "freemarker",
			"attr" : {
				"id" : 27
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "Hibernate",
			"attr" : {
				"id" : 24
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "JavaEEOne",
			"attr" : {
				"id" : 888,
				"title" : "JCP&JPA"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "JSP&Servlet&MVC2",
			"attr" : {
				"id" : 26,
				"title" : "descrtiption is need for every column"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "Spring",
			"attr" : {
				"id" : 23
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "junit",
			"attr" : {
				"id" : 29
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "JavaEE",
			"attr" : {
				"id" : 889,
				"title" : "JCP&JPA&JMail"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	}, {
		"data" : {
			"title" : "  jsp&servlet ",
			"attr" : {
				"id" : 28,
				"title" : "Java+EE+6+API+Specifications.CHM"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 22
		}
	} ],
	"attr" : {
		"id" : 0
	}
}, {
	"data" : {
		"title" : "JS&CSS&HTML",
		"attr" : {
			"id" : 101
		}
	},
	"children" : [ {
		"data" : {
			"title" : "HTML",
			"attr" : {
				"id" : 102
			}
		},
		"children" : [],
		"attr" : {
			"id" : 101
		}
	}, {
		"data" : {
			"title" : "JS",
			"attr" : {
				"id" : 104
			}
		},
		"children" : [],
		"attr" : {
			"id" : 101
		}
	}, {
		"data" : {
			"title" : "JQuery",
			"attr" : {
				"id" : 105
			}
		},
		"children" : [],
		"attr" : {
			"id" : 101
		}
	}, {
		"data" : {
			"title" : "CSS",
			"attr" : {
				"id" : 103
			}
		},
		"children" : [],
		"attr" : {
			"id" : 101
		}
	} ],
	"attr" : {
		"id" : 0
	}
}, {
	"data" : {
		"title" : "Operating System",
		"attr" : {
			"id" : 81
		}
	},
	"children" : [ {
		"data" : {
			"title" : "Mac",
			"attr" : {
				"id" : 890,
				"title" : "Max OS X Lion 使用的还是有的.哈哈"
			}
		},
		"children" : [],
		"attr" : {
			"id" : 81
		}
	}, {
		"data" : {
			"title" : "FreeBSD",
			"attr" : {
				"id" : 891,
				"title" : "我有个同学在使用FreeBSD."
			}
		},
		"children" : [],
		"attr" : {
			"id" : 81
		}
	}, {
		"data" : {
			"title" : "Ubuntu",
			"attr" : {
				"id" : 82
			}
		},
		"children" : [],
		"attr" : {
			"id" : 81
		}
	}, {
		"data" : {
			"title" : "Windows",
			"attr" : {
				"id" : 83
			}
		},
		"children" : [],
		"attr" : {
			"id" : 81
		}
	} ],
	"attr" : {
		"id" : 0
	}
}]

// ads
"data":[{
	"data" : {
		"title" : "首页焦点广告",
		"attr" : {
			"title" : "1",
			"class" : "123"
		}
	},
	"children" : [ {
		"data" : {
			"title" : "文字广告",
			"attr" : {
				"title" : "2",
				"class" : "123"
			}
		},
		"children" : [ {
			"data" : {
				"title" : "图片广告",
				"attr" : {
					"title" : "3",
					"class" : "123"
				}
			},
			"children" : [],
			"attr" : {
				"id" : 8
			}
		} ],
		"attr" : {
			"id" : 7
		}
	} ],
	"attr" : {
		"id" : 1
	}
}, {
	"data" : {
		"title" : "加盟酒店",
		"attr" : {
			"title" : "4",
			"class" : "123"
		}
	},
	"children" : [],
	"attr" : {
		"id" : 9
	}
}];

json_data = {
	"data" : [ {
		"data" : "A node",
		"metadata" : {
			id : 23
		},
		"children" : [ {
			"data" : {
				"title" : "maven",
				"attr" : {
					"id" : 64
				}
			},
			"children" : [],
			"attr" : {
				"id" : 61
			}
		}, {
			"data" : {
				"title" : "NetBeans",
				"attr" : {
					"id" : 63
				}
			},
			"children" : [],
			"attr" : {
				"id" : 61
			}
		} ],
	}, {
		"attr" : {
			"id" : "li.node.id1"
		},
		"data" : {
			"title" : "Long format demo",
			"attr" : {
				"href" : "#"
			}
		}

	} ]
};

